<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Sanatana HTML Version - Product</title>
<meta name="description" content="Default Description" />
<meta name="keywords" content="Santana, Varien, E-commerce" />
<meta name="robots" content="INDEX,FOLLOW" />
<link rel="icon" href="#" type="image/x-icon" />
<link rel="shortcut icon" href="#" type="image/x-icon" />

<!-- CSS =====================================================================================-->
<link href='http://fonts.googleapis.com/css?family=Telex' rel='stylesheet' type='text/css' />
<link rel="stylesheet" type="text/css" href="css/styles.css" media="all" />
<link rel="stylesheet" type="text/css" href="css/skin.css" media="all" />
<link rel="stylesheet" type="text/css" href="css/cloud-zoom.css" media="all" />
<link rel="stylesheet" type="text/css" href="css/light_box.css" media="all" />
<link rel="stylesheet" type="text/css" href="css/mix.css" media="all" />
<link rel="stylesheet" type="text/css" href="css/banner.css" media="all" />
<link rel="stylesheet" type="text/css" href="css/magicat.css" media="all" />

<!-- Scripts =====================================================================================-->
<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/jquery-1.6.1.min.js"></script>
<script type="text/javascript" src="js/common.js"></script>
<script type="text/javascript" src="js/menu.js"></script>
<script type="text/javascript" src="js/banner_pack.js"></script>
<script type="text/javascript" src="js/light_box.js"></script>
<script type="text/javascript" src="js/cloud-zoom.1.0.2.js"></script>
<script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="js/jquery.jcarousel.min.js"></script>
<script type="text/javascript" src="js/jquery.mix.js"></script>
</head>
<body id="bg_color" class=" cms-index-index cms-home">
<!--START OF WRAPPER-->
<div class="wrapper">
  <div class="page"> 
    
    <!--START OF HEADER-->
    <div class="header-container">
      <div class="quick-access"> 
        <!--Start Block Cart-->
        <div class="block block-cart header_cart">
          <div class="block-content_pan">
            <div class="summary trigger-minicart">
              <h2 class="classy"> <span class="cart_icon"><img alt="" src="images/shoppingbag.png" /></span><a href="#">0 item</a> </h2>
            </div>
            <div class="remain_cart" id="minicart">
              <p class="empty">You have no items in your shopping cart.</p>
              <div class="actions">
                <p class="subtotal"> <span class="label">Cart Subtotal:</span> <span class="price">$0.00</span> </p>
                <button type="button" title="Checkout" class="button"><span><span>Checkout</span></span></button>
              </div>
            </div>
          </div>
        </div>
        <!--End Block Cart--> 
        
        <!--Start Toplinks-->
        <ul class="links">
          <li class="first"><a href="#" title="My Account">My Account</a></li>
          <li><a href="#" title="Checkout" class="top-link-checkout">Checkout</a></li>
          <li class=" last"><a href="#" title="Log In">Log In</a></li>
        </ul>
        <!--End Toplinks--> 
        
        <!--Start Language-->
        <div class="form-language">
          <div class="language" id="select-language"> <a title="English" class="flag" href="#" style="background: url(./images/flag_default.gif) no-repeat scroll 0% 0% transparent;">English</a> <a title="French" class="flag" href="#" style="background: url(./images/flag_french.gif) no-repeat scroll 0% 0% transparent;">French</a> <a title="German" class="flag" href="#" style="background: url(./images/flag_german.gif) no-repeat scroll 0% 0% transparent;">German</a> </div>
        </div>
        <!--End Language--> 
        
        <!--Start Currency-->
        <div class="header_currency">
          <div class="block block-currency">
            <div class="block-content"> <a title="British Pound Sterling" class="currency_icon" style="background: url(./images/currency_GBP.gif) no-repeat" href="#">British Pound</a> <a title="Euro" class="currency_icon" style="background:url(./images/currency_EUR.gif) no-repeat" href="#">Euro</a> <a title="US Dollar" class="currency_icon selected" style="background: url(./images/currency_USD.gif) no-repeat" href="#">US Dollar</a> </div>
          </div>
        </div>
        <!--End Currency--> 
        
      </div>
      <!--Start Header Content-->
      <div class="header">
        <ul id="logo">
          <!--Left-->
          <li class="head-container"> <span>{</span>
            <h2 class="classy">Free shipping over $9.99</h2>
            <span>}</span>
            <p class="top-welcome-msg">Default welcome msg!</p>
          </li>
          <!--Left--> 
          <!--Center Logo-->
          <li class="logo-box">
            <h1 class="logo"><strong>Santana Commerce</strong><a href="#" title="Santana Commerce" class="logo"><img src="images/logo.png" alt="Santana Commerce" /></a></h1>
          </li>
          <!--Center Logo--> 
          
          <!--Right-->
          <li class="head-container"> <span>{</span>
            <h2 class="classy">Call us - +1 999 999 9999</h2>
            <span>}</span>
            <div id="search-bar">
              <div class="top-bar">
                <form id="search_mini_form" action="">
                  <div class="form-search">
                    <input 
                    onfocus="if(this.value=='Enter email address') {this.value=''};" onblur="if(this.value=='') {this.value='Enter email address'};"
                    id="search" name="q" value="Search" class="input-text" type="text" />
                    <button type="submit" title="Go" class="button">Go</button>
                  </div>
                </form>
              </div>
            </div>
          </li>
          <!--Right-->
        </ul>
        <!--Start of Navigation-->
        <div class="nav-container">
          <ul id="nav">
            <li><a href="#">Home</a></li>
            <li class="level0 nav-1 level-top first parent"> <a href="#" class="level-top"> <span>Womens</span> </a>
              <ul class="level0">
                <li class="level1 first parent"> <a href="#"> <span>Sweaters</span> </a>
                  <ul class="level1">
                    <li class="level2 first"> <a href="#"> <span>Cardigans</span> </a> </li>
                    <li class="level2"> <a href="#"> <span>Pullovers</span> </a> </li>
                    <li class="level2"> <a href="#"> <span>Novelty Sweaters</span> </a> </li>
                    <li class="level2 last"> <a href="#"> <span>Medium Wash</span> </a> </li>
                  </ul>
                </li>
                <li class="level1 parent"> <a href="#"> <span>Knit Tops</span> </a>
                  <ul class="level1">
                    <li class="level2 first"> <a href="#"> <span>Dressy</span> </a> </li>
                    <li class="level2"> <a href="#"> <span>Sporty</span> </a> </li>
                    <li class="level2"> <a href="#"> <span>Knit Jackets</span> </a> </li>
                    <li class="level2 last"> <a href="#"> <span>Tanks</span> </a> </li>
                  </ul>
                </li>
                <li class="level1 parent"> <a href="#"> <span>Shirts &amp; Blouses</span> </a>
                  <ul class="level1">
                    <li class="level2 first"> <a href="#"> <span>Dressy</span> </a> </li>
                    <li class="level2"> <a href="#"> <span>Casual</span> </a> </li>
                    <li class="level2"> <a href="#"> <span>A|X Logos</span> </a> </li>
                    <li class="level2"> <a href="#"> <span>Contemporary</span> </a> </li>
                    <li class="level2 last"> <a href="#"> <span>Plus Size</span> </a> </li>
                  </ul>
                </li>
                <li class="level1 parent"> <a href="#"> <span>Tee Shirts</span> </a>
                  <ul class="level1">
                    <li class="level2 first"> <a href="#"> <span>Crew Neck</span> </a> </li>
                    <li class="level2"> <a href="#"> <span>V-Neck</span> </a> </li>
                    <li class="level2 last"> <a href="#"> <span>Scoop Neck</span> </a> </li>
                  </ul>
                </li>
                <li class="level1 last parent"> <a href="#"> <span>Outerwear &amp; Jackets</span> </a>
                  <ul class="level1">
                    <li class="level2 first"> <a href="#"> <span>Scoop Neck</span> </a> </li>
                    <li class="level2"> <a href="#"> <span>Lightweight Layering</span> </a> </li>
                    <li class="level2"> <a href="#"> <span>Stock Up &amp; Save</span> </a> </li>
                    <li class="level2"> <a href="#"> <span>As Seen In</span> </a> </li>
                    <li class="level2 last"> <a href="#"> <span>Trends</span> </a> </li>
                  </ul>
                </li>
              </ul>
            </li>
            <li class="level0 nav-2 level-top parent"> <a href="#" class="level-top"> <span>Mens</span> </a>
              <ul class="level0">
                <li class="level1 first parent"> <a href="#"> <span>Apparel</span> </a>
                  <ul class="level1">
                    <li class="level2 first"> <a href="#"> <span>Blazers &amp; Sport Coats</span> </a> </li>
                    <li class="level2"> <a href="#"> <span>Coats &amp; Jackets</span> </a> </li>
                    <li class="level2"> <a href="#"> <span>Hoodies &amp; Track Jackets</span> </a> </li>
                    <li class="level2"> <a href="#"> <span>Shorts</span> </a> </li>
                    <li class="level2 last"> <a href="#"> <span>Shirts</span> </a> </li>
                  </ul>
                </li>
                <li class="level1 parent"> <a href="#"> <span>Shoes &amp; Accessories</span> </a>
                  <ul class="level1">
                    <li class="level2 first"> <a href="#"> <span>Casual</span> </a> </li>
                    <li class="level2"> <a href="#"> <span>Formals</span> </a> </li>
                    <li class="level2"> <a href="#"> <span>Sports</span> </a> </li>
                    <li class="level2"> <a href="#"> <span>Slippers</span> </a> </li>
                    <li class="level2 last"> <a href="#"> <span>Sandals</span> </a> </li>
                  </ul>
                </li>
                <li class="level1 parent"> <a href="#"> <span>Sweaters</span> </a>
                  <ul class="level1">
                    <li class="level2 first"> <a href="#"> <span>Pullover Sweaters</span> </a> </li>
                    <li class="level2"> <a href="#"> <span>Cardigans</span> </a> </li>
                    <li class="level2"> <a href="#"> <span>Lorem Ipsum</span> </a> </li>
                    <li class="level2"> <a href="#"> <span>Donec ipsum sem</span> </a> </li>
                    <li class="level2 last"> <a href="#"> <span>Sed in metu</span> </a> </li>
                  </ul>
                </li>
                <li class="level1 parent"> <a href="#"> <span>Coats &amp; Jackets</span> </a>
                  <ul class="level1">
                    <li class="level2 first"> <a href="#"> <span>Knit Jackets</span> </a> </li>
                    <li class="level2"> <a href="#"> <span>Coats</span> </a> </li>
                    <li class="level2"> <a href="#"> <span>blazers &amp; vests</span> </a> </li>
                    <li class="level2 last"> <a href="#"> <span>Denim Shop</span> </a> </li>
                  </ul>
                </li>
                <li class="level1 last parent"> <a href="#"> <span>Jeans</span> </a>
                  <ul class="level1">
                    <li class="level2 first"> <a href="#"> <span>Find Your Fit</span> </a> </li>
                    <li class="level2"> <a href="#"> <span>Accumsan</span> </a> </li>
                    <li class="level2"> <a href="#"> <span>Vivamus</span> </a> </li>
                    <li class="level2"> <a href="#"> <span>Pellentesque </span> </a> </li>
                    <li class="level2 last"> <a href="#"> <span>Quisque </span> </a> </li>
                  </ul>
                </li>
              </ul>
            </li>
            <li class="level0 level-top"> <a href="#" class="level-top"> <span>Furniture</span> </a> </li>
            <li class="level0 level-top"> <a href="#" class="level-top"> <span>Accesorries</span> </a> </li>
            <li class="level0 level-top"> <a href="#" class="level-top"> <span>Computer</span> </a> </li>
            <li class="level0 level-top last"> <a href="#" class="level-top"> <span>Electronics</span> </a> </li>
          </ul>
        </div>
        <!--End of Navigation--> 
      </div>
      <!--End Header Content--> 
    </div>
    <!--END OF HEADER--> 
    
    <!--START OF MAIN CONTENT-->
    <div class="main-container col1-layout">
      <div class="main">
        <div class="col-main">
          <div id="messages_product_view"></div>
          <div class="product-view">
            <div class="product-essential"> 
              <!--Start Product Information Right-->
              <div class="product-shop"> 
                <!--Prev/Next Code Start-->
                <div class="f-fix mb-10"><a href="#" class="prod-prev">PREV</a> <a class="prod-next" href="#">NEXT</a> </div>
                <!--Prev/Next Code End--> 
                <!--Product Title-->
                <div class="product-name">
                  <h1>Lorem ipsum dolor sit amet</h1>
                </div>
                <p class="availability in-stock"><span>In stock</span></p>
                <div class="price-box"> <span class="regular-price" id="product-price-167"> <span class="price">$175.00</span> </span> </div>
                <div class="pro-left">
                  <div class="short-description">
                    <h2>Quick Overview</h2>
                    <div class="std">Lorem ipsum dolor sit amet, consectetur 
                      adipiscing elit. Ut vel lorem eu metus placerat lacinia. Nunc arcu 
                      sapien, pulvinar a eleifend ut, fringilla eget felis. Praesent bibendum,
                      sem id bibendum sagittis, </div>
                  </div>
                  <div class="review">
                    <p class="no-rating"><a href="#">Be the first to review this product</a></p>
                    <div class="size_guide"><a class="ajax" href="./images/size_chart.gif"><span>Click here to watch Size Guide</span> </a></div>
                  </div>
                </div>
                <div class="pro-right">
                  <ul class="add-to-links">
                    <li><a href="#" class="link-wishlist">Add to Wishlist</a></li>
                    <li><span class="separator">|</span> <a href="#" class="link-compare">Add to Compare</a></li>
                  </ul>
                  <p class="email-friend"><a href="#">Email to a Friend</a></p>
                  <div class="add-to-box">
                    <div class="add-to-cart">
                      <label for="qty">Qty:</label>
                      <input name="qty" id="qty" maxlength="12" value="1" title="Qty" class="input-text qty" type="text" />
                      <a href="javascript:void(0)" id="reset_btn">Reset</a>
                      <button type="button" title="Add to Cart" class="button btn-cart" onclick="productAddToCartForm.submit(this)"><span><span>Add to Cart</span></span></button>
                      <div class="add">›</div>
                      <div class="dec add">‹</div>
                    </div>
                  </div>
                </div>
              </div>
              <!--End Product Information Right--> 
              
              <!--Start Product Image Zoom Left-->
              <div class="product-img-box">
                <p class="product-image product-image-zoom"> <a href='./images/zoom1.jpg' class = 'cloud-zoom' id='zoom1'
            rel="adjustX: 10, adjustY:-4"> <img style="max-height:400px; width:400px;" src="./images/zoom1.jpg" alt='' title="Optional title display" /> </a> </p>
                <div class="more-views">
                  <div class=" jcarousel-skin-tango">
                    <ul id="more_view">
                      <li><a href='./images/zoom2.jpg' class='cloud-zoom-gallery' title='Thumbnail 1'
        	rel="useZoom: 'zoom1', smallImage: './images/zoom2.jpg' "> <img style="max-height:92px; width:92px;" src="./images/thumbzoom2.jpg" alt = "Thumbnail 1"/></a></li>
                      <li> <a href='./images/zoom3.jpg' class='cloud-zoom-gallery' title='Thumbnail 2'
        	rel="useZoom: 'zoom1', smallImage: ' ./images/zoom3.jpg'"> <img style="max-height:90px; width:90px;" src="./images/thumbzoom3.jpg" alt = "Thumbnail 2"/></a> </li>
                      <li><a href='./images/zoom4.jpg' class='cloud-zoom-gallery' title='Thumbnail 3'
        	rel="useZoom: 'zoom1', smallImage: './images/zoom4.jpg' "> <img style="max-height:90px; width:90px;" src="./images/thumbzoom4.jpg" alt = "Thumbnail 3"/></a></li>
                      <li><a href='./images/zoom5.jpg' class='cloud-zoom-gallery' title='Thumbnail 3'
        	rel="useZoom: 'zoom1', smallImage: './images/zoom5.jpg' "> <img style="max-height:90px; width:90px;" src="./images/thumbzoom5.jpg" alt = "Thumbnail 3"/></a></li>
                      <li><a href='./images/zoom6.jpg' class='cloud-zoom-gallery' title='Thumbnail 3'
        	rel="useZoom: 'zoom1', smallImage: './images/zoom6.jpg' "> <img style="max-height:90px; width:90px;" src="./images/thumbzoom6.jpg" alt = "Thumbnail 3"/></a></li>
                    </ul>
                  </div>
                </div>
                <script type="text/javascript">
     	jQuery(document).ready(function(){
			jQuery('#product_tabs_description').click(function(){
				jQuery('#product_tabs_description_contents').css('display','block');
				jQuery('#product_tabs_product').css('display','none');
				jQuery('#product_tabs_form_contents').css('display','none');
				});
			jQuery('#product_tabs_product_tag').click(function(){
				jQuery('#product_tabs_description_contents').css('display','none');
				jQuery('#product_tabs_product').css('display','block');
				jQuery('#product_tabs_form_contents').css('display','none');
				});
			jQuery('#product_tabs_form').click(function(){
				jQuery('#product_tabs_description_contents').css('display','none');
				jQuery('#product_tabs_product').css('display','none');
				jQuery('#product_tabs_form_contents').css('display','block');
				});
			
			});
     </script> 
              </div>
              <!--End Product Image Zoom Left-->
              <div class="clearer"></div>
            </div>
            
            <!--Start Product Tabs-->
            <div class="product-collateral">
              <ul class="product-tabs">
                <li id="product_tabs_description" class=" active first"><a href="javascript:void(0)">Product Description</a></li>
                <li id="product_tabs_product_tag" class=""><a href="javascript:void(0)">Product Tags</a></li>
                <li id="product_tabs_form" class="last"><a href="javascript:void(0)">Review form</a></li>
              </ul>
              <div class="product-tabs-content" id="product_tabs_description_contents">
                <h2>Details</h2>
                <div class="std"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut vel 
                  lorem eu metus placerat lacinia. Nunc arcu sapien, pulvinar a eleifend 
                  ut, fringilla eget felis. Praesent bibendum, sem id bibendum sagittis, 
                  massa lacus lobortis dui, vitae ornare nisl orci et massa. Vivamus ut 
                  nulla metus. Class aptent taciti sociosqu ad litora torquent per conubia
                  nostra, per inceptos himenaeos. Suspendisse eros tortor, vehicula quis 
                  hendrerit a, dictum quis turpis. Nulla blandit tincidunt nibh eget 
                  tempus. Aliquam eleifend nisi nec nisl tempor non consectetur diam 
                  viverra. Cras cursus sodales neque sed mattis. Nunc id diam non massa 
                  porta pharetra sed et erat. Quisque pharetra dui ac justo imperdiet id 
                  tincidunt quam fringilla. </div>
              </div>
              <div style="display: none;" class="product-tabs-content" id="product_tabs_product">
                <div class="box-collateral box-tags">
                  <h2>Product Tags</h2>
                  <form id="addTagForm" method="get" action="">
                    <div class="form-add">
                      <label for="productTagName">Add Your Tags:</label>
                      <div class="input-box">
                        <input class="input-text required-entry" name="productTagName" id="productTagName" type="text" />
                      </div>
                      <button type="button" title="Add Tags" class="button" onclick="submitTagForm()"> <span> <span>Add Tags</span> </span> </button>
                    </div>
                  </form>
                  <p class="note">Use spaces to separate tags. Use single quotes (') for phrases.</p>
                </div>
              </div>
              <div style="display: none;" class="product-tabs-content" id="product_tabs_form_contents">
                <div class="form-add">
                  <h2>Write Your Own Review</h2>
                  <form  method="post" id="review-form" action="">
                    <fieldset>
                      <h3>You're reviewing: <span>Lorem ipsum dolor sit amet,</span></h3>
                      <h4>How do you rate this product? <em class="required">*</em></h4>
                      <span id="input-message-box"></span>
                      <table class="data-table" id="product-review-table">
                        <thead>
                          <tr class="first last">
                            <th>&nbsp;</th>
                            <th><span class="nobr">1 star</span></th>
                            <th><span class="nobr">2 stars</span></th>
                            <th><span class="nobr">3 stars</span></th>
                            <th><span class="nobr">4 stars</span></th>
                            <th><span class="nobr">5 stars</span></th>
                          </tr>
                        </thead>
                        <tbody>
                          <tr class="first odd">
                            <th>Quality</th>
                            <td class="value"><input name="ratings[1]" id="Quality_1" value="1" class="radio" type="radio" /></td>
                            <td class="value"><input name="ratings[1]" id="Quality_2" value="2" class="radio" type="radio" /></td>
                            <td class="value"><input name="ratings[1]" id="Quality_3" value="3" class="radio" type="radio" /></td>
                            <td class="value"><input name="ratings[1]" id="Quality_4" value="4" class="radio" type="radio" /></td>
                            <td class="value last"><input name="ratings[1]" id="Quality_5" value="5" class="radio" type="radio" /></td>
                          </tr>
                          <tr class="even">
                            <th>Price</th>
                            <td class="value"><input name="ratings[3]" id="Price_1" value="11" class="radio" type="radio" /></td>
                            <td class="value"><input name="ratings[3]" id="Price_2" value="12" class="radio" type="radio" /></td>
                            <td class="value"><input name="ratings[3]" id="Price_3" value="13" class="radio" type="radio" /></td>
                            <td class="value"><input name="ratings[3]" id="Price_4" value="14" class="radio" type="radio" /></td>
                            <td class="value last"><input name="ratings[3]" id="Price_5" value="15" class="radio" type="radio" /></td>
                          </tr>
                          <tr class="last odd">
                            <th>Value</th>
                            <td class="value"><input name="ratings[2]" id="Value_1" value="6" class="radio" type="radio" /></td>
                            <td class="value"><input name="ratings[2]" id="Value_2" value="7" class="radio" type="radio" /></td>
                            <td class="value"><input name="ratings[2]" id="Value_3" value="8" class="radio" type="radio" /></td>
                            <td class="value"><input name="ratings[2]" id="Value_4" value="9" class="radio" type="radio" /></td>
                            <td class="value last"><input name="ratings[2]" id="Value_5" value="10" class="radio" type="radio" /></td>
                          </tr>
                        </tbody>
                      </table>
                      <input name="validate_rating" class="validate-rating" value="" type="hidden" />
                      <ul class="form-list">
                        <li>
                          <label for="nickname_field" class="required"><em>*</em>Nickname</label>
                          <div class="input-box">
                            <input name="nickname" id="nickname_field" class="input-text required-entry" type="text" />
                          </div>
                        </li>
                        <li>
                          <label for="summary_field" class="required"><em>*</em>Summary of Your Review</label>
                          <div class="input-box">
                            <input name="title" id="summary_field" class="input-text required-entry" type="text" />
                          </div>
                        </li>
                        <li>
                          <label for="review_field" class="required"><em>*</em>Review</label>
                          <div class="input-box">
                            <textarea name="detail" id="review_field" cols="5" rows="3" class="required-entry"></textarea>
                          </div>
                        </li>
                      </ul>
                    </fieldset>
                    <div class="buttons-set">
                      <button type="submit" title="Submit Review" class="button"><span><span>Submit Review</span></span></button>
                    </div>
                  </form>
                </div>
              </div>
            </div>
            <!--End Product Tabs--> 
          </div>
        </div>
      </div>
      <div style="display: none;" id="back-top"> <a href="#"><img alt="" src="images/backtop.gif" /></a> </div>
    </div>
    <!--END OF MAIN CONTENT--> 
    
    <!--START OF FOOTER-->
    <div class="footer-container">
      <div class="footer">
        <div class="f-fix">
          <div class="frame">.</div>
          <!--Shipping Block-->
          <div class="free-shipping">Enjoy free shipping <span>on all orders as our holiday gift for you!</span></div>
          <!--Shipping Block--> 
          
          <!--Newsletter-->
          <form method="post" id="newsletter-validate-detail" action="">
            <div class="form-subscribe">
              <div class="form-subscribe-header">Sign up for newsletter</div>
              <div class="input-box">
                <input 
                onfocus="if(this.value=='Enter email address') {this.value=''};" onblur="if(this.value=='') {this.value='Enter email address'};"
                value="Enter email address" name="email" id="newsletter" title="Sign up for newsletter" class="input-text required-entry validate-email" type="text" />
                <button type="submit" title="Submit" class="button"><span>Submit</span></button>
              </div>
            </div>
          </form>
          <!--Newsletter-->  
        </div>
        <div class="f-left bottom_links">
          <div class="footer-content">
            <div class="block_1">
              <h3>About us</h3>
              <!--Footer links-->
              <ul class="footer_links">
                <li> <a href="#">About Us</a></li>
                <li> <a href="#">Customer Service</a></li>
                <li> <a href="#">Privacy Policy</a></li>
              </ul>
            </div>
            <div class="block_1">
              <h3>Customer Services</h3>
              <!--Footer links-->
              <ul class="footer_links">
                <li> <a href="#">Shipping &amp; Returns</a></li>
                <li> <a href="#">Secure Shopping</a></li>
                <li> <a href="#">Contact us</a></li>
              </ul>
            </div>
            <div class="block_1"> 
              <!--Footer links-->
              <h3>Terms &amp; Conditions</h3>
              <ul class="footer_links">
                <li> <a href="#">Press Room</a></li>
                <li> <a href="#">Help</a></li>
                <li> <a href="#">Terms &amp; Conditions</a></li>
              </ul>
            </div>
            <div class="block_2">
              <h3>Connect &amp; Share</h3>
              <!--Social links-->
              <div class="social_box">
                <div class="facebook"><a title="Facebook" href="#"></a></div>
                <div class="twitter"><a title="Twitter" href="#"></a></div>
                <div class="linkedin"><a title="Linkedin" href="#"></a></div>
                <div class="youtube"><a title="Youtube" href="#"></a></div>
              </div>
              <!--Payment Icons-->
              <div class="payment"> <img src="images/amexp.jpg" alt="" /> <img src="images/visa.jpg" alt="" /> <img src="images/mastercard.jpg" alt="" /> <img src="images/discover.jpg" alt="" /> </div>
            </div>
          </div>
        </div>
      </div>
      <address>
      © 2012 Santana Demo Store. All Rights Reserved. Design &amp; Develop by <a href="http://www.magicdesignlabs.com/">MagicDesignLabs</a>
      </address>
    </div>
    <!--END OF FOOTER--> 
    
  </div>
 <script type="text/javascript">
	 var minicart_timer;
    jQuery(".trigger-minicart").hover(function(){
        jQuery("#minicart").slideDown();
    });
    jQuery("#minicart").mouseleave(function(){
        jQuery("#minicart").slideUp();
    });
    jQuery("#minicart").hover(function(){
        clearTimeout(minicart_timer);
    });
	jQuery(document).ready(function(){
	jQuery('.pagebox_btn').click(function(){
		if(parseInt(jQuery('.page_pan').css('left')) < 0)
		{
			jQuery('.page_pan').animate({ left: '0' }, 600, 'easeOutQuint');
		}
		else{
			jQuery('.page_pan').animate({ left: '-100px' }, 600, 'easeOutQuint');
			}
		});
		});
</script>
</div>
<!--pages box-->
<div class="page_pan" style="left:-100px;">
	<div class="page_box">
    	<a href="http://www.magicdesignlabs.in/santana_html/index.html">Home</a>
        <a href="http://www.magicdesignlabs.in/santana_html/category.html">Category</a>
        <a href="http://www.magicdesignlabs.in/santana_html/product.html">Product</a>
        <a href="http://www.magicdesignlabs.in/santana_html/checkout.html">Checkout</a>
        <a href="http://www.magicdesignlabs.in/santana_html/contacts.html">Contact us</a>
    </div>
    <div class="pagebox_btn">
    	<span>P</span>
        <span>A</span>
        <span>G</span>
        <span>E</span>
        <span>S</span>
    </div>
</div>
<!--end pages box-->
<!--END OF WRAPPER-->
</body>
</html>